@CHARSET "UTF-8";

/**
 * MAIN DESIGN
 */

body {
	background-color:rgb(250,250,250);
	margin:0;
	padding:0;
	font-family: sans-serif;
}

#mainWrapper {
	margin:15px auto;
	width:90%;
	height: 690px;
	text-align:center;
	font-size:11px;
}

.userError{
	color: #FFFF33;
	font-weight:bold;
	font-size:16px;
	
	}

div.header {
	background-color:#343430;
	color:rgb(240,240,240);
	height:20px;
	width:100%;
	padding:5px 0px 5px 0px;
	text-align:center;
	font-size:16px;
	font-weight:bold;
	-moz-border-radius: 10px; 
	-webkit-border-radius: 10px;
}

div.errorArea {
	background-color:rgb(70,80,80);
	color:rgb(240,240,240);
	height:20px;
	width:100%;
	padding:5px 0px 5px 0px;
	text-align:center;
	font-size:16px;
	font-weight:bold;
}

div.menuItem {
	cursor: pointer; cursor: hand;
	background-color:rgb(70,80,80);
	color:rgb(240,240,240);
	height:20px;
	width:100%;
	padding:5px 0px 5px 0px;
	text-align:center;
	font-size:16px;
	font-weight:bold;
}

div.menuItem:hover {
	background-color:blue;
}



.rightHeading {
	float:left;
	padding-left:5px;
}

select.dropdown {
	float:right;
	margin-right:2px;
}

/**
 * USER AREA (LEFT PANEL)
 */

div.leftArea {
	background-color:#458B00;
	float:left;
	height:690px;
	width:15%;

	font-size:11px;
	overflow:auto;
	-moz-border-radius: 10px; 
	-webkit-border-radius: 10px; 
}

div.userLinks {
	min-height:20px;
	text-align:center;
	font-weight:bold;
}

div.userLinks a { 
	margin:auto;
	cursor:pointer;
	 }

div.userArea {

	text-align:left;
}

div.debug {
	padding:5px;
	text-align:left;
}

/**
 * EDITING AREA (CENTER PANEL)
 */

div.centerWrapper {
	background-color:rgb(240,240,250);
	float:left;
	height:690px;
	width:70%; 
	font-size:16pt;
	overflow:auto;
	-moz-border-radius: 10px; 
	-webkit-border-radius: 10px; 
}

/**
 * 630
 EDITING AREA (CENTER PANEL)
 */

div.centerArea {
	background-color:#EBEBE0;

	height:655px;
	width:100%;
	font-family:"Times New Roman",Georgia,Serif;
}


div.centerArea p {
	padding:4px;
}

/**
 * LOGIN AND ADMIN AREAS (RIGHT PANEL)
 */

div.rightWrapper {
	background-color:#458B00;
	float:left;
	height:690px; 
	width:15%;

	text-align:center;
	font-size:14px;
	-moz-border-radius: 10px; 
	-webkit-border-radius: 10px; 
}
div.rightArea {
	float:left;
	height:670px; 
	width:100%;
	color: white;
	
	
}

div.userAreaHeader {
	width: 100%;	
}

#loginArea {

	width:100%;
}

div.rightArea p {
	margin-left: 10px;
	padding:0px;
}

/**
 * MISCELLANEOUS
 */
input.email { width:150px; }
input.password { width:150px; }

textarea {
	border-color: black;
	border-style: solid;
	border-width: thin;
	padding: 3px;
	font-size: 18px;
	resize:none;
	clear:both;
}

input.test {
	font-size: 18px;
	width: 400px;
}

p { padding:3px; margin:0px; }



/**
 * Handles the html for the centerArea
 */

/**
 * For a list of all tests
 */
.testEntry {
	font-weight:bold;
	width: 97%;
	height: 30px; 
	margin: auto;
	margin-top:5px;
	border-style: solid;
	border-color: #458B00;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	background-color:#D9F56E;
}

.testHeader {
	color:white;
	width: 97%;
	height: 30px; 
	margin: auto;
	margin-top:5px;
	border: 3px;
	border-style: solid;
	border-color: #458B00;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	background-color:#343430;
}

.testAttribute {
	font-size: 16px;
	width: 19%;
	height: 29px;
	text-align:center;
	float: left;
	border: 1px;
	border-right:  groove;
	border-color: #458B00;

}

/**
 * For a list of all tests
 */
.userEntry {
	font-weight:bold;
	width: 97%;
	height: 40px; 
	margin: auto;
	margin-top:5px;
	border: 1px;
	border-style: solid;
	border-color: #458B00;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	background-color:#D9F56E;
}

.userHeader {
	color:white;
	width: 97%;
	height: 40px; 
	margin: auto;
	margin-top:5px;
	border: 3px;
	border-style: solid;
	border-color: #458B00;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	background-color:#343430;
}

.userAttribute {
	font-size: 16px;
	width: 13%;
	height: 39px;
	text-align:center;
	float: left;
	border: 1px;
	border-right:  groove;
	border-color: #458B00;

}


.editButton {
	font-size: 16px;
	color:white;
	cursor: pointer;
	width: 100%;
	height:100%;
	background-color: black;

}

.editButton:hover {
	background-color: gray;


}

.qAdder {
	font-size: 12px;
	color:white;
	cursor: pointer;
	width: 45%;
	height:100%;
	background-color: #191970;
	float: right;
	
}

.qAdder:hover {
	background-color:#66CDAA;	

}

/**
 * For a list of all results
 */
.resultEntry {
	font-weight:bold;
	width: 97%;
	height: 30px; 
	margin: auto;
	margin-top:5px;
	border: 1px;
	border-style: solid;
	border-color: #458B00;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	background-color:#D9F56E;
}

.resultHeader {
	color:white;
	width: 97%;
	height: 30px; 
	margin: auto;
	margin-top:5px;
	border: 3px;
	border-style: solid;
	border-color: #458B00;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	background-color:#343430;
}

.resultAttribute {
	font-size: 16px;
	width: 15%;
	height: 29px;
	text-align:center;
	float: left;
	border: 1px;
	border-right:  groove;
	border-color: #458B00;
}

/**
 * When solving a test
 */
.problem{
	width: 97%;
	display: inline-block;
    overflow: auto;
	text-align:left;
	font-size: 16px; 
	margin: auto;
	margin-top:5px;
	border: 3px;
	border-style: solid;
	border-color: #757575;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	background-color:#ECECEC;
}

.problemDescription {
	width: 99%;
	height: 60px; 
	margin: auto;
	clear:both;
}

.studentGuess {
	width: 78%;
	height: 120px; 
	float: left;
}


.buttonPad {
	padding-top: 18px;
	font-size: 18px;
	width: 20%;
	height: 102px;
	text-align:center;
	float: right;
	border: 3px;
	}

button.answerButton{
	margin-left:15px;
	width: 20%;
	height: 30px;
	float:left;
}
.answerStatus {
	width: 70%;
	height: 30px;
	float:right;
}

/**
 * Buttons
 */

.addButton {
	cursor: pointer; cursor: hand;
	color:white;
	font-size: 18px;
	width: 24%;
	height: 29px;
	text-align:center;
	margin:auto;
	margin-top:15px;
	border: 3px;
	border-color: #191970;
	background-color:#191970;

}
.addButton:hover {
	background-color:#66CDAA;

}


/**
 * Editing a question
 */
.question{
	width: 97%;
	display: inline-block;
    overflow: auto;
	text-align:left;
	font-size: 16px; 
	margin: auto;
	margin-top:5px;
	border: 3px;
	border-style: solid;
	border-color: #757575;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	background-color:#ECECEC;
}

.questionDescription {
	width: 99%;
	height: 120px; 
	margin: auto;
	clear:both;
}

.correctAnswer {
	width: 78%;
	height: 110px; 
	float: left;
}

.qEdit{
	width: 60%;	
}

.assessmentPanel{
	width:98%;
	height: 30px;
	float:left;
}

/**
 * Viewing a users answers and comparing them to the correct answers
 */
.answer{
	padding-left: 8px;
	width: 97%;
	display: inline-block;
    overflow: auto;
	text-align:left;
	font-size: 16px; 
	margin: auto;
	margin-top:5px;
	border: 3px;
	border-style: solid;
	border-color: #757575;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	background-color:#ECECEC;
}

/**
 * adding a question
 */
.questionAdder{
	font-size: 14px;
}

button.centerButton{
	margin:auto;
	width: 30%;
	height: 30px;

}

button.userEditButton{
	width: 40%;
	height: 40px;
}

.attributeEditor{
	float:left;
	margin-left: 10px;
	width: 60%;
	}
.passwordEditor{
	float:right;
	padding-left: 10px;
	width: 35%;
	height: 80%;
	}
.pwError{
	color: #FFFF33;
	font-weight:bold;
	font-size:16px;
	background-color:black;
	
	}